/**
 * 该文件用于景点的相关函数
 */

import AMapLoader from '@amap/amap-jsapi-loader'
import { ElNotification } from 'element-plus'
import { defineStore } from 'pinia'

export const useMapManageStore = defineStore('map', {
  state: () => ({
    map: {},
  }),
  actions: {
    //初始化地图
    initMap(container) {
      AMapLoader.load({
        key: '59c00a4f1f90273427b02569d19d1474',
        version: '2.0',
        plugins: ['AMap.Scale'],
      })
        .then((AMap) => {
          const layer = new AMap.createDefaultLayer({
            zooms: [3, 20],
            visible: true,
            opacity: 1,
            zIndex: 0,
          })
          this.map = new AMap.Map(container, {
            viewMode: '2D',
            mapStyle: 'amap://styles/normal',
            zoom: 10,
            layer: [layer],
            center: [116.397428, 39.90923],
          })
          AMap.plugin('AMap.ToolBar', function () {
            const toolbar = new AMap.ToolBar()
            map.addControl(toolbar)
          })
          AMap.plugin('AMap.Scale', function () {
            const scale = new AMap.Scale()
            map.addControl(scale)
          })
          // 添加图层类型
          map.plugin(['AMap.MapType'], function () {
            const type = new AMap.MapType({
              defaultType: 0,
            })
            map.addControl(type)
          })
        })
        .catch((error) => {
          ElNotification({
            message: error,
          })
        })
    },
    // addScenicToMap(scenics) {
    //   //获取景点
    //   const markerContent=`<div class="custom-content-marker">
    //   <img src="//a.amap.com/jsapi_demos/static/demo-center/icons/dir-via-marker.png">
    //   <div class="close-btn" onclick="clearMarker()">X</div>
    //   </div>`
    //   scenics.forEach((scenic)=>{
    //     const position=new Amap.LngLat()
    //   })
    // },
  },
})
